window.addEventListener('load',function(){
    var inputs=document.querySelectorAll('.txt');
    var phNum=document.querySelector('.phonenum').querySelector('span');
    var btn=document.querySelector('.yzm').querySelector('button');
    var password=document.querySelector('.password').querySelector('span');
    var rpassword=document.querySelector('.rpassword').querySelector('span');
    var qiang=this.document.querySelector('.qiang');
    var ruo=this.document.querySelector('.ruo');
    var zhong=this.document.querySelector('.zhong');
    // console.log(phNum);

    //手机号
    var phre=/^1[3-9]\d{9}$/;
    inputs[0].addEventListener('focus',function(){
        
        phNum.innerHTML='<img src="images/warn.png" >请输入11位手机号码';
        phNum.style.color='#808080';
        
    })
    inputs[0].addEventListener('blur',function(){
        var num=this.value;
        console.log(phre.test(num));
        if(!phre.test(num)){
            phNum.innerHTML='<img src="images/fail.png" >手机号码格式不正确，请从新输入';
            phNum.style.color='#df3033';
        }
        else{
            phNum.innerHTML='<img src="images/right.png" >输入正确';
            phNum.style.color='#8cd232';
        }
    })
    //

    //验证码
    function fn(){
        if(time!=0){
                btn.innerHTML='请等待'+time+'s后再次点击';
                time--;
            }
            else{
                btn.disabled=false;
                btn.innerHTML='获取验证码';
                clearInterval(timer);
                time=5;
            }
    }
    var time=5;
    btn.addEventListener('click',function(){
        btn.disabled=true;
        fn();
        timer=setInterval(fn,1000);
    })
    //

    //密码
    var isnum=/\d/;
    var isapl=/[A-Za-z]/;
    var isspec=/[~!@#$%^&*()_+]/;
    var isspace=/\s/;
    var isok=false;
    var isclick=false;
    inputs[2].addEventListener('focus',function(){
        console.log(password.innerHTML);
        if(password.innerHTML==""){
            password.innerHTML='<img src="images/warn.png" >6-16位字符(数字，字母，符号)';
            password.style.color='#808080';
        }
    })
    inputs[2].addEventListener('input',function(){
        var psw=this.value;
        if(psw.length<6){
            password.innerHTML='<img src="images/fail.png" >密码较短，最短支持6个字符';
            password.style.color='#df3033';
            isok=false;
        }
        else{
            var count=0;
            if(isnum.test(this.value)) count++;
            if(isapl.test(this.value)) count++;
            if(isspec.test(this.value)) count++;

            if(isspace.test(psw)){
                password.innerHTML='<img src="images/fail.png" >密码不能包含空格符';
                password.style.color='#df3033';
                isok=false;
            }
            else if(count==1){
                zhong.style.backgroundColor='';
                qiang.style.backgroundColor='';
                ruo.style.backgroundColor='#de1111';
                password.innerHTML='<img src="images/fail.png" >密码强度较弱，请重新输入';
                password.style.color='#df3033';
                isok=false;
            }
            else if(count==2){
                ruo.style.backgroundColor='#de1111';
                zhong.style.backgroundColor='#40b83f';
                qiang.style.backgroundColor='';
                password.innerHTML='<img src="images/right.png" >试试大小写字母、数字和特殊字符混合';
                password.style.color='#8cd232';
                isok=true;
            }
            else{
                ruo.style.backgroundColor='#de1111';
                zhong.style.backgroundColor='#40b83f';
                qiang.style.backgroundColor='#f79100';
                password.innerHTML='<img src="images/right.png" >请牢记您的密码';
                password.style.color='#8cd232';
                isok=true;
            }
            
        }
    })
    inputs[2].addEventListener('blur',function(){
        // var psw=this.value;
        // var isspace=/\s/;
        // var isnum=/^\d{6,16}$/;
        // var isapl=/^[A-Za-z]{6,16}$/
        // var iszhong=/^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{6,16}$/;
        // // /^((\d([A-Z][a-z])+){6,16})$/
        // var isqiang=/^(?=.*[A-Za-z])(?=.*\d)(?=.*[!@#$%^&*()_/-=~+])[A-Za-z\d!@#$%^&*()_/-=~+]{6,16}$/
        // console.log(isspace.test(psw));
        // console.log(psw);
        // console.log(isnum.test(psw));
        // console.log(isapl.test(psw));

        // console.log(iszhong.test(psw));
        // if(psw.length<6){
        //     password.innerHTML='<img src="images/fail.png" >密码较短，最短支持6个字符';
        //     password.style.color='#df3033';
        //     isok=false;
        // }
        // else{
        //     if(isspace.test(psw)){
        //         password.innerHTML='<img src="images/fail.png" >密码不能包含空格符';
        //         password.style.color='#df3033';
        //         isok=false;
        //     }
        //     else if(isnum.test(psw)|isapl.test(psw)){
        //         zhong.style.backgroundColor='';
        //         qiang.style.backgroundColor='';
        //         ruo.style.backgroundColor='#de1111';
        //         password.innerHTML='<img src="images/fail.png" >密码强度较弱，请重新输入';
        //         password.style.color='#df3033';
        //         isok=false;
        //     }
        //     else if(iszhong.test(psw)){
        //         ruo.style.backgroundColor='#de1111';
        //         zhong.style.backgroundColor='#40b83f';
        //         qiang.style.backgroundColor='';
        //         password.innerHTML='<img src="images/right.png" >试试大小写字母、数字和特殊字符混合';
        //         password.style.color='#8cd232';
        //         isok=true;
        //     }
        //     else{
        //         ruo.style.backgroundColor='#de1111';
        //         zhong.style.backgroundColor='#40b83f';
        //         qiang.style.backgroundColor='#f79100';
        //         password.innerHTML='<img src="images/right.png" >请牢记您的密码';
        //         password.style.color='#8cd232';
        //         isok=true;
        //     }

            //判断密码是否一致
            if(isclick){
                if(!isok){
                    rpassword.innerHTML='<img src="images/fail.png"> 请先正确输入登录密码';
                    rpassword.style.color='#df3033';
                }
                else {
                    rpassword.innerHTML='<img src="images/fail.png"> 两次输入密码不相同,请重新输入';
                    rpassword.style.color='#df3033';
                }
            }
           
        // }
    })
    //

    //确认密码
    inputs[3].addEventListener('focus',function(){
        isclick=true;
        rpassword.innerHTML='<img src="images/warn.png"> 请再次输入密码';
        rpassword.style.color='#808080';
    })
    inputs[3].addEventListener('blur',function(){
        if(inputs[2].value==''|!isok){
            rpassword.innerHTML='<img src="images/fail.png"> 请先正确输入登录密码';
            rpassword.style.color='#df3033';
        }
        else if(this.value==inputs[2].value&isok){
            rpassword.innerHTML='<img src="images/right.png"> 密码相同';
            rpassword.style.color='#8cd232';
        }
        else{
            rpassword.innerHTML='<img src="images/fail.png"> 两次输入密码不相同,请重新输入';
            rpassword.style.color='#df3033';
        }
    })
    //

    
})






